
import React from 'react';
import { connect } from 'dva';
import PropTypes from 'prop-types';
import { Icon, Card, Col } from 'antd';
import CountUp from 'react-countup';

class CardUl extends React.Component {
  constructor(...args) {
    super(...args);
  }
  render() {
    const { title, all, day, week, month } = this.props;

    return (
      <div style={{ flex: 1, fontSize: '16px' }}>
        <h3>{title}</h3>
        <h3>{all}</h3>
        <p><span>日</span>{day}</p>
        <p><span>周</span>{week}</p>
        <p><span>月{month}</span></p>
      </div>
    );
  }
}
class CardMsg extends React.Component {
  constructor(...args) {
    super(...args);
  }
  render() {
    const { msg, title } = this.props;

    let i = 0;
    const carduls = msg.map(item => <CardUl {...item} key={i++} />);

    return (
      <Card bodyStyle={{ padding: '10px' }}>
        <h1 style={{ textAlign: 'center', marginBottom: '15px', borderBottom: '1px solid #999', width: '30%', margin: 'auto', height: '40px', lineHeight: '40px' }}>{title}</h1>
        <div style={{ display: 'flex', textAlign: 'center', marginTop: '10px' }}>
          {carduls}
        </div>
      </Card>
    );
  }
}

CardMsg.propTypes = {
};

export default connect()(CardMsg);
